<!-- BEGIN PHOTO SETTINGS TAB -->
<div class="tab-pane" id="photo-settings">
  <div class="row">

    <div class="col-md-6 ">
      <div class="form-group">
        <h2>Featured photo</h2>
        <%= f.hidden_field :featured_image, value: '' -%>
        <%= render 'attached_image', image: @actionPage.featured_image -%>
        <h4>Specifications:</h4>
        <ul>
          <li>Recommended size: w=600px, h=315px</li>
          <li>Run JPEGs through <a href="http://imageoptim.com/mozjpeg">MozJPEG</a> to compress</li>
          <li>File size should be <strong>no greater than 40kB</strong></li>
        </ul>
      </div>
    </div>

    <div class="col-md-6">
      <div class="form-group">
        <h2>Background photo</h2>
        <%= f.hidden_field :background_image, value: '' -%>
        <%= render 'attached_image', image: @actionPage.background_image -%>
        <h4>Specifications:</h4>
        <ul>
          <li>Recommended size: w=1440px, h=400px</li>
          <li><strong>Must be dark</strong> (so white text shows)</li>
          <li>Run JPEGs through <a href="http://imageoptim.com/mozjpeg">MozJPEG</a> to compress</li>
          <li>File size should be <strong>no greater than 120kB</strong></li>
        <ul>
      </div>
    </div>

  </div>
</div><!-- .tab-pane -->
<!-- TABEND -->
